<template>
  <!-- 主播电台 -->
  <div>
    <ul>
      <li v-for="item in datalist.slice(0,10)" :key="item.index">
        <img :src="item.picUrl">
        <p>{{item.name}}</p>
        <p class="s10">{{item.artistName}}</p>
      </li>
    </ul>
  </div>
</template>
<style scoped>
ul {
  width: 960px;
  display: flex;
  flex-wrap: wrap;
}
ul > li {
  margin: 10px;
  list-style: none;
  width: 170px;
  border-radius: 10px;
}
ul li img {
  width: 100%;
}
</style>
<script>
import axios from "axios";
import { API } from "../../../common/constant";
export default {
  data() {
    return {
      datalist: [],
    };
  },
  mounted() {
    // 要登录
    axios.get(`${API}/personalized/playlist`).then((res) => {
      this.datalist = this.datalist.concat(res.data.result);
    });
  },
};
</script>
